<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge" /><![endif]-->
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width,initial-scale=1"><!-- Place favicon.ico in the root directory -->
    <link rel="apple-touch-icon" href="apple-touch-icon.png">
    <link rel="icon" href="favicon.ico">
    <link href="https://fonts.googleapis.com/css?family=Poppins:100,300,400,500,700,900" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Caveat" rel="stylesheet">
    <title>Dashcore - Premium Software & Startup HTML</title><!-- themeforest:css -->
    <link rel="stylesheet" href="css/all.css">
    <link rel="stylesheet" href="css/aos.css">
    <link rel="stylesheet" href="css/cookieconsent.min.css">
    <link rel="stylesheet" href="css/magnific-popup.css">
    <link rel="stylesheet" href="css/odometer-theme-minimal.css">
    <link rel="stylesheet" href="css/prism-okaidia.css">
    <link rel="stylesheet" href="css/simplebar.css">
    <link rel="stylesheet" href="css/smart_wizard.css">
    <link rel="stylesheet" href="css/smart_wizard_theme_arrows.css">
    <link rel="stylesheet" href="css/smart_wizard_theme_circles.css">
    <link rel="stylesheet" href="css/smart_wizard_theme_dots.css">
    <link rel="stylesheet" href="css/swiper.css">
    <link rel="stylesheet" href="css/theme.css">
    <link rel="stylesheet" href="css/rtl.css"><!-- endinject -->
</head>

<body>
    <!--[if lt IE 8]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
    <!-- Making stripe menu -->
    <nav class="st-nav navbar main-nav navigation fixed-top dark-link" id="main-nav">
        <div class="container">
            <ul class="st-nav-menu nav navbar-nav">
                <li class="st-nav-section nav-item"><a href="#main" class="navbar-brand"><img src="img/logo.png" alt="Dashcore" class="logo logo-sticky"></a></li>
                <li class="st-nav-section st-nav-primary nav-item"><a class="st-root-link nav-link" href="index.html">Home </a><a class="st-root-link item-products st-has-dropdown nav-link" data-dropdown="blocks">Blocks </a><a class="st-root-link item-products st-has-dropdown nav-link" data-dropdown="pages">Pages </a><a class="st-root-link item-company st-has-dropdown nav-link" data-dropdown="components">UI Components </a><a class="st-root-link item-blog st-has-dropdown nav-link" data-dropdown="blog">Blog </a><a class="st-root-link item-shop st-has-dropdown nav-link" href="shop/" data-dropdown="shop">Shop</a></li>
                <li class="st-nav-section st-nav-secondary nav-item"><a class="btn btn-rounded btn-outline mr-3 px-3" href="login.html" target="_blank"><i class="fas fa-sign-in-alt d-none d-md-inline mr-md-0 mr-lg-2"></i> <span class="d-md-none d-lg-inline">Login</span> </a><a class="btn btn-rounded btn-solid px-3" href="signup.html" target="_blank"><i class="fas fa-user-plus d-none d-md-inline mr-md-0 mr-lg-2"></i> <span class="d-md-none d-lg-inline">Signup</span></a></li><!-- Mobile Navigation -->
                <li class="st-nav-section st-nav-mobile nav-item"><button class="st-root-link navbar-toggler" type="button"><span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span></button>
                    <div class="st-popup">
                        <div class="st-popup-container"><a class="st-popup-close-button">Close</a>
                            <div class="st-dropdown-content-group">
                                <h4 class="text-uppercase regular">Pages</h4><a class="regular text-primary" href="about.html"><i class="far fa-building mr-2"></i> About </a><a class="regular text-success" href="contact.html"><i class="far fa-envelope mr-2"></i> Contact </a><a class="regular text-warning" href="pricing.html"><i class="fas fa-hand-holding-usd mr-2"></i> Pricing </a><a class="regular text-info" href="faqs.html"><i class="far fa-question-circle mr-2"></i> FAQs</a>
                            </div>
                            <div class="st-dropdown-content-group border-top bw-2">
                                <h4 class="text-uppercase regular">Components</h4>
                                <div class="row">
                                    <div class="col mr-4"><a target="_blank" href="components/alert.html">Alerts</a> <a target="_blank" href="components/badge.html">Badges</a> <a target="_blank" href="components/button.html">Buttons</a> <a target="_blank" href="components/color.html">Colors</a> <a target="_blank" href="components/accordion.html">Accordion</a> <a target="_blank" href="components/cookie-law.html">Cookielaw</a></div>
                                    <div class="col mr-4"><a target="_blank" href="components/overlay.html">Overlay</a> <a target="_blank" href="components/progress.html">Progress</a> <a target="_blank" href="components/lightbox.html">Lightbox</a> <a target="_blank" href="components/tab.html">Tabs</a> <a target="_blank" href="components/tables.html">Tables</a> <a target="_blank" href="components/typography.html">Typography</a></div>
                                </div>
                            </div>
                            <div class="st-dropdown-content-group bg-light b-t"><a href="login.html">Sign in <i class="fas fa-arrow-right"></i></a></div>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="st-dropdown-root">
            <div class="st-dropdown-bg">
                <div class="st-alt-bg"></div>
            </div>
            <div class="st-dropdown-arrow"></div>
            <div class="st-dropdown-container">
                <div class="st-dropdown-section" data-dropdown="blocks">
                    <div class="st-dropdown-content">
                        <div class="st-dropdown-content-group">
                            <div class="row">
                                <div class="col mr-4"><a class="dropdown-item" target="_blank" href="blocks/call-to-action.html">Call to actions</a> <a class="dropdown-item" target="_blank" href="blocks/contact.html">Contact</a> <a class="dropdown-item" target="_blank" href="blocks/counter.html">Counters</a> <a class="dropdown-item" target="_blank" href="blocks/faqs.html">FAQs</a></div>
                                <div class="col mr-4"><a class="dropdown-item" target="_blank" href="blocks/footer.html">Footers</a> <a class="dropdown-item" target="_blank" href="blocks/form.html">Forms</a> <a class="dropdown-item" target="_blank" href="blocks/navbar.html">Navbar</a> <a class="dropdown-item" target="_blank" href="blocks/navigation.html">Navigation</a></div>
                                <div class="col"><a class="dropdown-item" target="_blank" href="blocks/pricing.html">Pricing</a> <a class="dropdown-item" target="_blank" href="blocks/slider.html">Sliders</a> <a class="dropdown-item" target="_blank" href="blocks/team.html">Team</a> <a class="dropdown-item" target="_blank" href="blocks/testimonial.html">Testimonials</a></div>
                            </div>
                        </div>
                        <div class="st-dropdown-content-group">
                            <h3 class="link-title"><i class="fas fa-long-arrow-alt-right icon"></i> Coming soon</h3>
                            <div class="ml-5"><span class="dropdown-item text-secondary">Dividers </span><span class="dropdown-item text-secondary">Gallery </span><span class="dropdown-item text-secondary">Screenshots</span></div>
                        </div>
                    </div>
                </div>
                <div class="st-dropdown-section" data-dropdown="pages">
                    <div class="st-dropdown-content">
                        <div class="st-dropdown-content-group">
                            <div class="mb-4">
                                <h3 class="text-darker light text-nowrap"><span class="bold regular">Useful pages</span> you'll need</h3>
                                <p class="text-secondary mt-0">Get a complete design stack</p>
                            </div>
                            <div class="row">
                                <div class="col">
                                    <ul class="mr-4">
                                        <li>
                                            <h4 class="text-uppercase regular">Error</h4>
                                        </li>
                                        <li><a target="_blank" href="403.html">403 Error</a></li>
                                        <li><a target="_blank" href="404.html">404 Error</a></li>
                                        <li><a target="_blank" href="405.html">405 Error</a></li>
                                    </ul>
                                </div>
                                <div class="col">
                                    <ul class="mr-4">
                                        <li>
                                            <h4 class="text-uppercase regular">User</h4>
                                        </li>
                                        <li><a target="_blank" href="login.html">Login</a></li>
                                        <li><a target="_blank" href="register.html">Register</a></li>
                                        <li><a target="_blank" href="forgot.html">Forgot</a></li>
                                    </ul>
                                </div>
                                <div class="col">
                                    <ul>
                                        <li>
                                            <h4 class="text-uppercase regular">Extra</h4>
                                        </li>
                                        <li><a target="_blank" href="pricing.html">Pricing</a></li>
                                        <li><a target="_blank" href="terms.html">Terms</a></li>
                                        <li><a target="_blank" href="faqs.html">FAQ</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="st-dropdown-content-group"><a class="dropdown-item bold" href="about.html"><i class="far fa-building icon"></i> About </a><a class="dropdown-item bold" href="contact.html"><i class="far fa-envelope icon"></i> Contact </a><a class="dropdown-item bold" href="pricing.html"><i class="fas fa-hand-holding-usd icon"></i> Pricing</a></div>
                    </div>
                </div>
                <div class="st-dropdown-section" data-dropdown="components">
                    <div class="st-dropdown-content">
                        <div class="st-dropdown-content-group"><a class="dropdown-item" target="_blank" href="components/color.html">
                                <div class="media mb-4"><i class="fas fa-palette mr-2 bg-primary rounded-circle icon-md text-contrast center-flex"></i>
                                    <div class="media-body">
                                        <h3 class="link-title m-0">Colors</h3>
                                        <p class="m-0 text-secondary">Get to know DashCore color options</p>
                                    </div>
                                </div>
                            </a><a class="dropdown-item" target="_blank" href="components/accordion.html">
                                <div class="media mb-4"><i class="fas fa-bars mr-2 bg-primary rounded-circle icon-md text-contrast center-flex"></i>
                                    <div class="media-body">
                                        <h3 class="link-title m-0">Accordion</h3>
                                        <p class="m-0 text-secondary">Useful accordion elements</p>
                                    </div>
                                </div>
                            </a><a class="dropdown-item" target="_blank" href="components/cookie-law.html">
                                <div class="media mb-4"><i class="fas fa-cookie-bite mr-2 bg-primary rounded-circle icon-md text-contrast center-flex"></i>
                                    <div class="media-body">
                                        <h3 class="link-title m-0">CookieLaw</h3>
                                        <p class="m-0 text-secondary">Comply with the hideous EU Cookie Law</p>
                                    </div>
                                </div>
                            </a>
                            <h4 class="text-uppercase regular">Huge components list</h4>
                            <div class="row">
                                <div class="col mr-4"><a class="dropdown-item" target="_blank" href="components/alert.html">Alerts</a> <a class="dropdown-item" target="_blank" href="components/badge.html">Badges</a> <a class="dropdown-item" target="_blank" href="components/button.html">Buttons</a></div>
                                <div class="col mr-4"><a class="dropdown-item" target="_blank" href="components/overlay.html">Overlay</a> <a class="dropdown-item" target="_blank" href="components/progress.html">Progress</a> <a class="dropdown-item" target="_blank" href="components/lightbox.html">Lightbox</a></div>
                                <div class="col mr-4"><a class="dropdown-item" target="_blank" href="components/tab.html">Tabs</a> <a class="dropdown-item" target="_blank" href="components/tables.html">Tables</a> <a class="dropdown-item" target="_blank" href="components/typography.html">Typography</a></div>
                            </div>
                        </div>
                        <div class="st-dropdown-content-group"><a class="dropdown-item" target="_blank" href="components/wizard.html">Wizard <span class="badge badge-pill badge-primary">New</span></a> <span class="dropdown-item d-flex align-items-center text-muted">Timeline <i class="fas fa-ban ml-auto"></i></span> <span class="dropdown-item d-flex align-items-center text-muted">Process <i class="fas fa-ban ml-auto"></i></span></div>
                    </div>
                </div>
                <div class="st-dropdown-section" data-dropdown="blog">
                    <div class="st-dropdown-content">
                        <div class="st-dropdown-content-group">
                            <div class="row">
                                <div class="col mr-4">
                                    <h4 class="regular text-uppercase">Full width</h4><a class="dropdown-item" target="_blank" href="blog/blog-post.html">Single post</a> <a class="dropdown-item" target="_blank" href="blog/blog-grid.html">Posts Grid</a>
                                </div>
                                <div class="col mr-4">
                                    <h4 class="regular text-uppercase">Sidebar left</h4><a class="dropdown-item" target="_blank" href="blog/blog-post-sidebar-left.html">Single post</a> <a class="dropdown-item" target="_blank" href="blog/blog-grid-sidebar-left.html">Posts Grid</a>
                                </div>
                                <div class="col mr-4">
                                    <h4 class="regular text-uppercase">Sidebar right</h4><a class="dropdown-item" target="_blank" href="blog/blog-post-sidebar-right.html">Single post</a> <a class="dropdown-item" target="_blank" href="blog/blog-grid-sidebar-right.html">Posts Grid</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="st-dropdown-section" data-dropdown="shop">
                    <div class="st-dropdown-content">
                        <div class="st-dropdown-content-group"><a class="dropdown-item" target="_blank" href="shop/home.html">
                                <div class="media align-items-center">
                                    <div class="bg-success text-contrast icon-md center-flex rounded-circle mr-3"><i class="fas fa-shopping-basket"></i></div>
                                    <div class="media-body">
                                        <h3 class="link-title m-0">Home</h3>
                                        <p class="m-0 text-secondary">Online store home with an outstanding UX</p>
                                    </div>
                                </div>
                            </a><a class="dropdown-item" target="_blank" href="shop/cart.html">
                                <div class="media align-items-center">
                                    <div class="bg-info text-contrast icon-md center-flex rounded-circle mr-3"><i class="fas fa-shopping-cart"></i></div>
                                    <div class="media-body">
                                        <h3 class="link-title m-0">Cart</h3>
                                        <p class="m-0 text-secondary">Online store shopping cart</p>
                                    </div>
                                </div>
                            </a></div>
                        <div class="st-dropdown-content-group">
                            <h3 class="link-title"><i class="fas fa-money-check-alt icon"></i> Checkout</h3>
                            <div class="ml-5"><a class="dropdown-item text-secondary" target="_blank" href="shop/checkout-customer.html">Customer <i class="fas fa-angle-right ml-2"></i> </a><a class="dropdown-item text-secondary" target="_blank" href="shop/checkout-shipping.html">Shipping Information <i class="fas fa-angle-right ml-2"></i> </a><a class="dropdown-item text-secondary" target="_blank" href="shop/checkout-payment.html">Payment Methods <i class="fas fa-angle-right ml-2"></i> </a><a class="dropdown-item text-secondary" target="_blank" href="shop/checkout-confirmation.html">Order Review <i class="fas fa-angle-right ml-2"></i></a></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </nav>
    <main class="overflow-hidden">
        <!-- Payment Services Heading -->
        <header class="header payment-services-header section" id="home">
            <div class="shapes-container">
                <div class="static-shape shape-main cutout x2 bottom-right"></div>
            </div>
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-md-6 text-center text-md-left"><span class="py-2">Online Payments —</span>
                        <h1 class="bold font-md display-lg-2 mt-3">Pay Online <span class="d-block">Anywhere, anytime</span></h1>
                        <p class="lead">Besides its beautiful design. Dashcore is an incredibly rich core framework for you to showcase your App.</p>
                        <div class="my-5"><a href="#!" class="btn btn-rounded btn-lg btn-primary px-4 mx-auto mr-md-0">Know more <i class="fas fa-long-arrow-alt-right ml-2"></i></a></div>
                    </div>
                    <div class="col-md-6">
                        <div class="shapes-container">
                            <div class="static-shape pattern-dots"></div>
                        </div>
                        <figure class="figure-box mockup cutout x2 bottom-right">
                            <div class="screens"><img src="img/payment-services/bg.png" alt="..."> <img src="img/payment-services/person.png" class="position-absolute" data-aos="fade-up" alt="..."></div>
                            <div class="promo-box card shadow-lg border-0" data-aos="fade-up" data-aos-delay="400">
                                <div class="card-body p-5 text-center">
                                    <figure class="icon-xxl mx-auto"><img src="img/payment-services/secure.svg" alt="..."></figure>
                                    <p class="mt-4 text-muted mb-0">Fast and Secure</p>
                                    <hr class="my-3 mx-auto w-25">
                                    <h6 class="h6 mb-0">Commission free</h6>
                                </div>
                            </div>
                        </figure>
                    </div>
                </div>
            </div>
        </header><!-- Credit Cards Management -->
        <section class="section">
            <div class="container">
                <div class="row gap-y align-items-center">
                    <div class="col-md-6">
                        <div class="card shadow bg-dark no-action mx-auto wallet">
                            <div class="card-body d-flex align-items-center justify-content-between"><img src="img/avatar/1.jpg" class="icon-md rounded-circle" alt=""> <span class="text-uppercase small bold">checkout</span> <i data-feather="bell"></i></div>
                            <div class="card-body">
                                <div class="swiper-container" data-sw-autoplay="2500">
                                    <div class="swiper-wrapper">
                                        <div class="swiper-slide">
                                            <div class="card credit-card credit-card-st1">
                                                <div class="shapes-container">
                                                    <div class="shape shape-1">
                                                        <div></div>
                                                    </div>
                                                    <div class="shape shape-2">
                                                        <div></div>
                                                    </div>
                                                </div>
                                                <div class="card-body">
                                                    <div class="row justify-content-between align-items-center">
                                                        <div class="col d-flex">
                                                            <div class="icon-md rounded-circle bg-danger op-7"></div>
                                                            <div class="icon-md rounded-circle bg-warning op-7" style="transform: translateX(-50%)"></div>
                                                        </div>
                                                        <div class="col-auto"><span class="badge badge-success">Active</span></div>
                                                    </div>
                                                    <div class="my-4">
                                                        <div class="d-flex justify-content-around align-items-center">
                                                            <div class="d-flex">
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                            </div>
                                                            <div class="d-flex">
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                            </div>
                                                            <div class="d-flex">
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                            </div>
                                                            <div class="text-dark bold">1234</div>
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                        <div class="col">
                                                            <div class="small text-muted">Card holder</div>
                                                            <div class="text-dark semi-bold h6">John Doe</div>
                                                        </div>
                                                        <div class="col text-right">
                                                            <div class="small text-muted">Expires</div>
                                                            <div class="text-dark semi-bold h6">08/24</div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="swiper-slide">
                                            <div class="card credit-card credit-card-st2">
                                                <div class="shapes-container">
                                                    <div class="shape shape-1">
                                                        <div></div>
                                                    </div>
                                                    <div class="shape shape-2">
                                                        <div></div>
                                                    </div>
                                                </div>
                                                <div class="card-body">
                                                    <div class="row justify-content-between align-items-center">
                                                        <div class="col d-flex">
                                                            <div class="icon-md rounded-circle bg-danger op-7"></div>
                                                            <div class="icon-md rounded-circle bg-warning op-7" style="transform: translateX(-50%)"></div>
                                                        </div>
                                                        <div class="col-auto"><span class="badge badge-success">Active</span></div>
                                                    </div>
                                                    <div class="my-4">
                                                        <div class="d-flex justify-content-around align-items-center">
                                                            <div class="d-flex">
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                            </div>
                                                            <div class="d-flex">
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                            </div>
                                                            <div class="d-flex">
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                            </div>
                                                            <div class="text-dark bold">1234</div>
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                        <div class="col">
                                                            <div class="small text-muted">Card holder</div>
                                                            <div class="text-dark semi-bold h6">John Doe</div>
                                                        </div>
                                                        <div class="col text-right">
                                                            <div class="small text-muted">Expires</div>
                                                            <div class="text-dark semi-bold h6">08/24</div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="swiper-slide">
                                            <div class="card credit-card credit-card-st3">
                                                <div class="shapes-container">
                                                    <div class="shape shape-1">
                                                        <div></div>
                                                    </div>
                                                    <div class="shape shape-2">
                                                        <div></div>
                                                    </div>
                                                </div>
                                                <div class="card-body">
                                                    <div class="row justify-content-between align-items-center">
                                                        <div class="col d-flex">
                                                            <div class="icon-md rounded-circle bg-danger op-7"></div>
                                                            <div class="icon-md rounded-circle bg-warning op-7" style="transform: translateX(-50%)"></div>
                                                        </div>
                                                        <div class="col-auto"><span class="badge badge-success">Active</span></div>
                                                    </div>
                                                    <div class="my-4">
                                                        <div class="d-flex justify-content-around align-items-center">
                                                            <div class="d-flex">
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                            </div>
                                                            <div class="d-flex">
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                            </div>
                                                            <div class="d-flex">
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                                <div class="safe-digit"></div>
                                                            </div>
                                                            <div class="text-dark bold">1234</div>
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                        <div class="col">
                                                            <div class="small text-muted">Card holder</div>
                                                            <div class="text-dark semi-bold h6">John Doe</div>
                                                        </div>
                                                        <div class="col text-right">
                                                            <div class="small text-muted">Expires</div>
                                                            <div class="text-dark semi-bold h6">08/24</div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="card card-details bg-contrast">
                                <div class="card-body pb-0 d-flex align-items-center justify-content-between">
                                    <h6 class="m-0 bold">Summary</h6><button class="btn btn-primary btn-sm"><i class="fas fa-arrow-left"></i></button>
                                </div>
                                <div class="card-body">
                                    <div class="list-group list-group-flush">
                                        <div class="list-group-item px-0">
                                            <div class="d-flex justify-content-between mb-0">
                                                <div class="text-left">
                                                    <p class="my-0 semi-bold font-sm">Sony X800H</p>
                                                    <p class="my-0 small text-muted">Ultra HD Smart LED TV</p>
                                                </div>
                                                <div class="text-right">
                                                    <p class="my-0 bold font-sm">$535.45</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="list-group-item px-0">
                                            <div class="d-flex justify-content-between mb-0">
                                                <div class="text-left">
                                                    <p class="my-0 semi-bold font-sm">Apple TV 4k</p>
                                                </div>
                                                <div class="text-right">
                                                    <p class="my-0 bold font-sm">$183.95</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="list-group-item px-0">
                                            <div class="d-flex justify-content-between mb-0">
                                                <div class="text-left">
                                                    <p class="my-0 semi-bold font-sm">Shipping</p>
                                                </div>
                                                <div class="text-right">
                                                    <p class="my-0 bold font-sm">$5.99</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="list-group-item px-0 pb-0">
                                            <div class="d-flex justify-content-between mb-0">
                                                <div class="text-left">Total</div>
                                                <div class="text-right"><span class="bold">$ 725.39</span></div>
                                            </div>
                                        </div>
                                    </div>
                                </div><button class="btn btn-primary btn-block btn-place-order">Place Order</button>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="section-heading">
                            <h2 class="heading-line bold"><span class="light">In-app</span><br>Checkout</h2>
                            <p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro, recusandae tenetur!</p>
                        </div>
                        <p class="mb-5">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dignissimos eligendi esse, facilis fugit inventore iste itaque labore magni minima minus molestiae neque nesciunt nihil nobis nulla, quaerat quibusdam repellat sequi!</p><a href="#!" class="btn btn-outline-darker">Learn More</a>
                    </div>
                </div>
            </div>
        </section><!-- Gifts -->
        <section class="section with-promo">
            <div class="container">
                <div class="row gap-y align-items-center">
                    <div class="col-md-6">
                        <div class="section-heading">
                            <h2 class="heading-line bold"><span class="light">Accumulate points</span><br>when doing payments</h2>
                            <p class="lead">The More you Pay the More you Earn</p>
                        </div>
                        <p class="mb-5">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dignissimos eligendi esse, facilis fugit inventore iste itaque labore magni minima minus molestiae neque nesciunt nihil nobis nulla, quaerat quibusdam repellat sequi!</p><a href="#!" class="btn btn-outline-darker">Learn More</a>
                    </div>
                    <div class="col-md-6">
                        <figure class="figure-box mockup cutout bottom-right mr-md-0">
                            <div class="screens"><img src="img/payment-services/gift.png" alt=""></div>
                            <div class="promo-box card shadow bottom-left">
                                <div class="circle-icon icon-lg bg-success p-2 rounded-circle center-flex shadow"><i data-feather="gift" class="stroke-contrast"></i></div>
                                <div class="card-body">
                                    <p class="small text-primary mb-3">Notification</p>
                                    <p class="text-dark h4">$168.00</p>
                                    <p class="small">In your favor for making payments</p>
                                </div>
                            </div>
                            <div class="shapes-container">
                                <div class="shape pattern pattern-dots"></div>
                            </div>
                        </figure>
                    </div>
                </div>
            </div>
        </section><!-- Gifts -->
        <section class="section with-promo anime-background">
            <div class="shapes-container">
                <div class="static-shape shape-main right"></div>
            </div>
            <div class="container">
                <div class="row gap-y align-items-center">
                    <div class="col-md-6 order-md-last">
                        <div class="section-heading">
                            <h2 class="heading-line bold"><span class="light">Take a break</span><br>You're all Safe</h2>
                            <p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloribus eius modi saepe voluptas.</p>
                        </div>
                        <p class="mb-5">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dignissimos eligendi esse, facilis fugit inventore iste itaque labore magni minima minus molestiae neque nesciunt nihil nobis nulla, quaerat quibusdam repellat sequi!</p><a href="#!" class="btn btn-outline-darker">Learn More</a>
                    </div>
                    <div class="col-md-6">
                        <figure class="figure-box mockup cutout bottom-left ml-md-0">
                            <div class="screens"><img src="img/payment-services/security.png" alt=""></div>
                            <div class="promo-box card shadow top-right">
                                <div class="circle-icon icon-lg bg-success p-2 rounded-circle center-flex shadow"><i data-feather="shield" class="stroke-contrast"></i></div>
                                <div class="card-body">
                                    <p class="small text-primary mb-3">You're Safe</p>
                                    <p class="text-dark bold">Just smile</p>
                                    <p class="small">All transactions are protected with e2e encryption</p>
                                </div>
                            </div>
                            <div class="shapes-container">
                                <div class="shape pattern pattern-dots"></div>
                            </div>
                        </figure>
                    </div>
                </div>
            </div>
        </section><!-- Smart Wallet -->
        <section class="section smart-wallet">
            <div class="shapes-container">
                <div class="shape pattern pattern-dots"></div>
            </div>
            <div class="container">
                <div class="row gap-y align-items-center">
                    <div class="col-md-6">
                        <div class="section-heading">
                            <h2 class="heading-line bold"><span class="light">Smart</span><br>Wallet</h2>
                            <p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro, recusandae tenetur!</p>
                        </div>
                        <p class="mb-5">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dignissimos eligendi esse, facilis fugit inventore iste itaque labore magni minima minus molestiae neque nesciunt nihil nobis nulla, quaerat quibusdam repellat sequi!</p><a href="#!" class="btn btn-outline-darker">Learn More</a>
                    </div>
                    <div class="col-md-6">
                        <div class="card shadow bg-dark no-action mx-auto wallet">
                            <div class="card-body d-flex align-items-center justify-content-between"><img src="img/avatar/1.jpg" class="icon-md rounded-circle" alt=""> <span class="text-uppercase small bold">my transactions</span> <i data-feather="bell"></i></div>
                            <div class="card-body"><span class="small">Available Balance</span>
                                <p class="h2 mt-0 text-contrast">$ <span class="counter">1,485.21</span></p>
                            </div>
                            <div class="card-body"><button class="btn btn-primary">Pay</button> <button class="btn btn-contrast">Request</button></div>
                            <div class="card card-details bg-contrast">
                                <div class="card-body pb-0 d-flex align-items-center justify-content-between">
                                    <h6 class="m-0 bold">My Transactions</h6><button class="btn btn-primary btn-sm"><i class="fas fa-sliders-h"></i></button>
                                </div>
                                <div class="card-body">
                                    <div class="list-group list-group-flush">
                                        <div class="list-group-item px-0">
                                            <div class="d-flex justify-content-between mb-0">
                                                <div class="media">
                                                    <div class="icon-md bg-primary p-2 rounded-circle center-flex mr-3"><i data-feather="cast" class="stroke-contrast"></i></div>
                                                    <div class="media-body">
                                                        <p class="my-0 bold font-sm">Streaming Membership</p>
                                                        <p class="my-0 small text-muted">Today</p>
                                                    </div>
                                                </div>
                                                <div class="text-right">
                                                    <p class="my-0 bold font-sm">-$35.45</p>
                                                    <p class="my-0 small text-danger">Sent</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="list-group-item px-0">
                                            <div class="d-flex justify-content-between mb-0">
                                                <div class="media">
                                                    <div class="icon-md bg-primary p-2 rounded-circle center-flex mr-3"><i data-feather="coffee" class="stroke-contrast"></i></div>
                                                    <div class="media-body">
                                                        <p class="my-0 bold font-sm">Morning Coffee</p>
                                                        <p class="my-0 small text-muted">Today</p>
                                                    </div>
                                                </div>
                                                <div class="text-right">
                                                    <p class="my-0 bold font-sm">-$5.45</p>
                                                    <p class="my-0 small text-danger">Sent</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="list-group-item px-0">
                                            <div class="d-flex justify-content-between mb-0">
                                                <div class="media">
                                                    <div class="icon-md bg-primary p-2 rounded-circle center-flex mr-3"><img src="img/avatar/2.jpg" class="icon-md rounded-circle" alt=""></div>
                                                    <div class="media-body">
                                                        <p class="my-0 bold font-sm">Margaret Jane</p>
                                                        <p class="my-0 small text-muted">Yesterday</p>
                                                    </div>
                                                </div>
                                                <div class="text-right">
                                                    <p class="my-0 bold font-sm">+$135.45</p>
                                                    <p class="my-0 small text-success">Received</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="list-group-item px-0">
                                            <div class="d-flex justify-content-between mb-0">
                                                <div class="media">
                                                    <div class="icon-md bg-primary p-2 rounded-circle center-flex mr-3"><i data-feather="shopping-bag" class="stroke-contrast"></i></div>
                                                    <div class="media-body">
                                                        <p class="my-0 bold font-sm">Fashion Store</p>
                                                        <p class="my-0 small text-muted">3rd May, 2020</p>
                                                    </div>
                                                </div>
                                                <div class="text-right">
                                                    <p class="my-0 bold font-sm">-$178.95</p>
                                                    <p class="my-0 small text-danger">Sent</p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section><!-- Features -->
        <section class="section">
            <div class="container">
                <div class="section-heading">
                    <h2 class="heading-line">Powerful Features</h2>
                </div>
                <div class="row gap-y text-center text-md-left">
                    <div class="col-md-4">
                        <div class="icon-anime mb-3"><i data-feather="pie-chart" width="36" height="36" class="icon stroke-darker"></i>
                            <div class="shape bg-alternate-gradient circle" data-aos="fade-up" data-aos-delay="100" data-aos-offset="0"></div>
                        </div>
                        <p class="my-0 bold lead text-dark">Dashboard</p>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed do eiusmod tempor.</p>
                    </div>
                    <div class="col-md-4">
                        <div class="icon-anime mb-3"><i data-feather="dollar-sign" width="36" height="36" class="icon stroke-darker"></i>
                            <div class="shape bg-alternate-gradient circle" data-aos="fade-up" data-aos-delay="100" data-aos-offset="0"></div>
                        </div>
                        <p class="my-0 bold lead text-dark">Save money</p>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed do eiusmod tempor.</p>
                    </div>
                    <div class="col-md-4">
                        <div class="icon-anime mb-3"><i data-feather="sliders" width="36" height="36" class="icon stroke-darker"></i>
                            <div class="shape bg-alternate-gradient circle" data-aos="fade-up" data-aos-delay="100" data-aos-offset="0"></div>
                        </div>
                        <p class="my-0 bold lead text-dark">Design tools</p>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed do eiusmod tempor.</p>
                    </div>
                    <div class="col-md-4">
                        <div class="icon-anime mb-3"><i data-feather="download" width="36" height="36" class="icon stroke-darker"></i>
                            <div class="shape bg-alternate-gradient circle" data-aos="fade-up" data-aos-delay="100" data-aos-offset="0"></div>
                        </div>
                        <p class="my-0 bold lead text-dark">Updates</p>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed do eiusmod tempor.</p>
                    </div>
                    <div class="col-md-4">
                        <div class="icon-anime mb-3"><i data-feather="pie-chart" width="36" height="36" class="icon stroke-darker"></i>
                            <div class="shape bg-alternate-gradient circle" data-aos="fade-up" data-aos-delay="100" data-aos-offset="0"></div>
                        </div>
                        <p class="my-0 bold lead text-dark">Dashboard</p>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed do eiusmod tempor.</p>
                    </div>
                    <div class="col-md-4">
                        <div class="icon-anime mb-3"><i data-feather="dollar-sign" width="36" height="36" class="icon stroke-darker"></i>
                            <div class="shape bg-alternate-gradient circle" data-aos="fade-up" data-aos-delay="100" data-aos-offset="0"></div>
                        </div>
                        <p class="my-0 bold lead text-dark">Save money</p>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed do eiusmod tempor.</p>
                    </div>
                </div>
            </div>
        </section><!-- Payment Services Partners -->
        <section class="section partners">
            <div class="container">
                <div class="mb-5">
                    <h2 class="heading-line">Trusted by 13,000+<br>Business Leaders all Around the Globe</h2>
                </div>
                <div class="row">
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="100"><img src="img/logos/1.png" class="img-responsive mx-auto mb-5" alt="" style="max-height: 40px"></figure>
                    </div>
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="200"><img src="img/logos/2.png" class="img-responsive mx-auto mb-5" alt="" style="max-height: 40px"></figure>
                    </div>
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="300"><img src="img/logos/3.png" class="img-responsive mx-auto mb-5" alt="" style="max-height: 40px"></figure>
                    </div>
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="400"><img src="img/logos/4.png" class="img-responsive mx-auto mb-5" alt="" style="max-height: 40px"></figure>
                    </div>
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="500"><img src="img/logos/5.png" class="img-responsive mx-auto mb-5" alt="" style="max-height: 40px"></figure>
                    </div>
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="600"><img src="img/logos/6.png" class="img-responsive mx-auto mb-5" alt="" style="max-height: 40px"></figure>
                    </div>
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="700"><img src="img/logos/7.png" class="img-responsive mx-auto mb-5 mb-md-0" alt="" style="max-height: 40px"></figure>
                    </div>
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="800"><img src="img/logos/8.png" class="img-responsive mx-auto mb-5 mb-md-0" alt="" style="max-height: 40px"></figure>
                    </div>
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="900"><img src="img/logos/9.png" class="img-responsive mx-auto mb-5 mb-md-0" alt="" style="max-height: 40px"></figure>
                    </div>
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="1000"><img src="img/logos/10.png" class="img-responsive mx-auto" alt="" style="max-height: 40px"></figure>
                    </div>
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="1100"><img src="img/logos/11.png" class="img-responsive mx-auto" alt="" style="max-height: 40px"></figure>
                    </div>
                    <div class="col-4 col-md-2">
                        <figure class="mockup" data-aos="fade-right" data-aos-delay="1200"><img src="img/logos/12.png" class="img-responsive mx-auto" alt="" style="max-height: 40px"></figure>
                    </div>
                </div>
            </div>
        </section><!-- Try it -->
        <section class="section anime-background">
            <div class="shapes-container">
                <div class="static-shape shape-main left"></div>
            </div>
            <div class="container text-center text-md-left">
                <div class="row">
                    <div class="col-md-8 section-heading">
                        <p class="bold mb-0 text-primary">Are you ready to try?</p>
                        <h2 class="mt-0">Register for free NOW!</h2>
                        <p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam ducimus ea facilis illum laboriosam, provident quidem recusandae sequi velit vero. Aliquid commodi eos esse exercitationem itaque iure iusto molestiae nemo.</p>
                    </div>
                </div><a href="#" class="btn btn-rounded btn-primary btn-lg mt-2 mt-md-0 mx-auto">Get your Free Demo</a>
            </div>
        </section><!-- ./Footer - Four Columns -->
        <footer class="site-footer section">
            <div class="container pb-4">
                <div class="row gap-y text-center text-md-left">
                    <div class="col-md-4 mr-auto"><img src="img/logo.png" alt="" class="logo">
                        <p>Dashcore, a carefully crafted and powerful HTML5 template, it's perfect to showcase your startup or software</p>
                    </div>
                    <div class="col-md-2">
                        <h6 class="py-2 bold">Company</h6>
                        <nav class="nav flex-column"><a class="nav-item py-2" href="about.html">About</a> <a class="nav-item py-2" href="#">Services</a> <a class="nav-item py-2" href="blog/blog-grid.html">Blog</a></nav>
                    </div>
                    <div class="col-md-2">
                        <h6 class="py-2 bold">Product</h6>
                        <nav class="nav flex-column"><a class="nav-item py-2" href="#">Features</a> <a class="nav-item py-2" href="#">API</a> <a class="nav-item py-2" href="#">Customers</a></nav>
                    </div>
                    <div class="col-md-2">
                        <h6 class="py-2 bold">Channels</h6>
                        <nav class="nav flex-column"><a class="nav-item py-2" href="#">Careers</a> <a class="nav-item py-2" href="#">Contact</a> <a class="nav-item py-2" href="#">Search</a></nav>
                    </div>
                </div>
                <hr class="mt-5">
                <div class="row small align-items-center">
                    <div class="col-md-4">
                        <p class="mt-2 mb-md-0 text-secondary text-center text-md-left">© 2018 5studios. All Rights Reserved</p>
                    </div>
                    <div class="col-md-8">
                        <nav class="nav justify-content-center justify-content-md-end"><a href="#" class="btn btn-circle btn-sm btn-secondary mr-3 op-4"><i class="fab fa-facebook"></i></a> <a href="#" class="btn btn-circle btn-sm btn-secondary mr-3 op-4"><i class="fab fa-twitter"></i></a> <a href="#" class="btn btn-circle btn-sm btn-secondary op-4"><i class="fab fa-instagram"></i></a></nav>
                    </div>
                </div>
            </div>
        </footer>
    </main><!-- themeforest:js -->
    <script src="js/01.cookie-consent-util.js"></script>
    <script src="js/02.1.cookie-consent-themes.js"></script>
    <script src="js/02.2.cookie-consent-custom-css.js"></script>
    <script src="js/02.3.cookie-consent-informational.js"></script>
    <script src="js/02.4.cookie-consent-opt-out.js"></script>
    <script src="js/02.5.cookie-consent-opt-in.js"></script>
    <script src="js/02.6.cookie-consent-location.js"></script>
    <script src="js/card.js"></script>
    <script src="js/counterup2.js"></script>
    <script src="js/index.js"></script>
    <script src="js/noframework.waypoints.js"></script>
    <script src="js/odometer.min.js"></script>
    <script src="js/prism.js"></script>
    <script src="js/simplebar.js"></script>
    <script src="js/swiper.js"></script>
    <script src="js/popper.js"></script>
    <script src="js/jquery.js"></script>
    <script src="js/jquery.easing.min.js"></script>
    <script src="js/jquery.validate.js"></script>
    <script src="js/jquery.smartWizard.js"></script>
    <script src="js/plugins/jquery.animatebar.js"></script>
    <script src="js/feather.min.js"></script>
    <script src="js/bootstrap.js"></script>
    <script src="js/aos.js"></script>
    <script src="js/typed.js"></script>
    <script src="js/jquery.magnific-popup.js"></script>
    <script src="js/cookieconsent.min.js"></script>
    <script src="js/common-script.js"></script>
    <script src="js/forms.js"></script>
    <script src="js/stripe-bubbles.js"></script>
    <script src="js/stripe-menu.js"></script>
    <script src="js/cc.js"></script>
    <script src="js/pricing.js"></script>
    <script src="js/shop.js"></script>
    <script src="js/svg.js"></script>
    <script src="js/site.js"></script>
    <script src="js/03.demo.js"></script><!-- endinject -->
</body>

</html>